 <!-- template
    ================================================== -->
    <script id="t_a" type="text/html">
    	<% var services = json.services, processes = json.processes, i , item; %>
		
        <div class="tabbable">
            <ul class="nav nav-tabs">
                <li class="active">
                    <a href="#1" data-toggle="tab">服务器监控项目</a>
                </li>
                <li>
                    <a href="#2" data-toggle="tab">系统服务监控项目</a>
                </li>
                <li>
                    <a href="#3" data-toggle="tab">进程监控项目（仅监控运行）</a>
                </li>				
            </ul>
            <div class="tab-content">
            	
                <div class="tab-pane active" id="1">
                	
                	
                <form class="form-horizontal" onsubmit="return false;">
                    <fieldset>
                        <legend>
                            服务器监控项目
                        </legend>
                        <% for (i in json) { item = json[i];
                        if(i != 'services'  && i != 'processes'){ %>
                        <div class="control-group">
                            <h5>
                                <label class="checkbox inline">
                                    <input type="checkbox" name="" value="<%= i %>"<%= item.monitored ? 'checked' : '' %>/>&nbsp;<%= map[i][0] %>
                                </label><span class="help-inline"><%= map[i][1] %>
                                </span></h5>
                            <div class="input-append">
                                <label class="checkbox inline">
                                    <%= map[i][2] %>：
                                </label>
                                <input type="text" name="" value="<%= item.caution %>" /><span class="add-on"><%= map[i][4] %></span>
                            </div>
                            <div class="input-append">
                                <label class="checkbox inline">
                                    <%= map[i][3] %>：
                                </label>
                                <input type="text" name="" value="<%= item.warning %>" /><span class="add-on"><%= map[i][4] %></span>
                            </div>							
                        </div>
                        <% } } %>
                    </fieldset>
                </form>
                	
                </div>
				
                <div class="tab-pane" id="2">
                	
			<% if( services ) { %>
			<fieldset>
			 	<legend>系统服务监控项目</legend>
				<br />
        <table class="table table-striped table-bordered table-condensed">
            <thead>
                <tr>
                    <th>
                       	 是否监控
                    </th>                	
                    <th>
                       	 服务名
                    </th>
                    <th>
                        	端口号
                    </th>
                    <th>
						主机(不填为本地)
                    </th>
                    <th>
						telnet探测
                    </th>
                    <th>
                        	添加项目
                    </th>
                </tr>
            </thead>
            <tbody>
                <% for (i in services) { item = services[i]; %>
                <tr>
                    <td>
                        <input type="checkbox" name="<%= i %>" <%= item[0]*1 ? 'checked' : '' %> />
                    </td>
                    <td>
                        <input type="text" name="" value="<%= i %>" />
                    </td>					
                    <td>
                    	<input type="text" name="" value="<%= item[1] %>" />
                    </td>
                    <td>
                        <input type="text" name="" value="<%= item[2] %>" />
                    </td>
                    <td>
                        <input type="checkbox" name="<%= i %>" <%= item[3]*1 ? 'checked' : '' %> />
                    </td>
                    <td>
                        <button class="btn" name="add" title="添加新的监控项目"><i class="icon-plus"></i></button>
                    </td>
                </tr>
                <% } %>
            </tbody>
        </table>	
		<% }  %>			
			</fieldset>
								
					
                	
                </div>
				
                <div class="tab-pane" id="3">
                	
	<% if( processes ) { %>
			<fieldset>
			 	<legend>进程监控项目（仅监控运行）</legend>
				<br />
        <table class="table table-striped table-bordered table-condensed">
            <thead>
                <tr>
                    <th>
                       	 是否监控
                    </th>                	
                    <th>
                       	 显示名称
                    </th>
                    <th>
						进程名
                    </th>
                    <th>
						是否为java进程
                    </th>
                    <th>
                       	 添加项目
                    </th>
                </tr>
            </thead>
            <tbody>
                <% for (i in processes) { item = processes[i]; %>
                <tr>
                    <td>
                        <input type="checkbox" name="<%= i %>" <%= item[0]*1 ? 'checked' : '' %> />
                    </td>
                    <td>
                        <input type="text" name="" value="<%= i %>" />
                    </td>					
                    <td>
                        <input type="text" name="" value="<%= item[1] %>" />
                    </td>
                    <td>
                        <input type="checkbox" name="<%= i %>" <%= item[2]*1 ? 'checked' : '' %> />
                    </td>
                    <td>
                        <button class="btn" name="add" title="添加新的监控项目"><i class="icon-plus"></i></button>
                    </td>
                </tr>
                <% } %>
            </tbody>
        </table>	
		<% }  %>							
					
                	
                </div>	
							
            </div>
        </div>			
		
						
            <div class="form-actions">
                <button class='btn' name="prev">
                    	上一步 
                </button>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <button class='btn' name="next">
                    	下一步 
                </button>
            </div>		
        

    </script>
	
<script>	
	$(function(){
	var smartMad = window.smartMad = window.smartMad || {};
	var domain = domainURI();
    var version = urlParams('version');
	
    var _url = 'http://' + domain + '/mmsapi' + version;
	
	var monitorOptionMap = smartMad.monitorOptionMap; 
	
	var monitorOption = urlParams('monitorOption') || '';
	var serverId = urlParams('serverId') || '';
	
    var call = function(e, json){
        var $th = $(this), data, html;
        
        //$th.html(JSON.stringify(json));return;
        ///////////////////////////////////////////
		
        ///////////////////////////////////////////		
        
        data = {
            json: json,
			map : smartMad.genericOptionMap
        };
        html = template('t_a', data);
        $th.html(html);		
		
    };
	
	var conf = {
		url: _url + '/get/detailSetting/@generic/' + serverId
	};
	
	////////////////////////////////////////////////
	//init
	////////////////////////////////////////////////
	
	
    $('#set').bind('ajax.success',call).getData(conf)
	.delegate('button[name="next"]', 'click', function(){
		
    })
	.delegate('button[name="prev"]', 'click', function(){
		location.href='monitorWizard.html?monitorOption=' + monitorOption + '&version=' + version;
	});
	
});

</script>